<template>
  <div id="app">
    <template v-if="context">
      <div>
        <navigation></navigation>
      </div>
      <hr>
      <transition name="el-zoom-in-center">
      <template v-if="show === '隐藏'">
        <pageMenu @clickMenu="changeStruct"></pageMenu>
      </template>
      </transition>
      <div class="contents">
        <context @refshStruct="changeStruct"></context>
      </div>
    </template>
    <transition name="el-zoom-in-center">
    <template v-if="!context">
      <navMenu></navMenu>
    </template>
    </transition>
  </div>
</template>

<script>
  import {mapState, mapMutations} from 'vuex';
  import navigation from './page/configPage/navigation.vue'
  import pageMenu from './page/configPage/menu-tree.vue'
  import navMenu from './page/managePage/nav-menu.vue'
  import context from './page/configPage/plate'
  import fetch from "./store/uacc_api";
  export default {
    name: 'app',
    data: function () {
      return {
        value: '',
        activeIndex: '1'
      }
    },
    computed: mapState(['show', 'context', 'currentNode', 'env']),
    components: {
      navigation: navigation,
      pageMenu: pageMenu,
      navMenu: navMenu,
      context
    },
    //初始化应用
    created: function () {
      /*默认环境：日常环境*/
      this.initEnv();
      /*初始化所有的配置集*/
      this.initCfgMaps();
      /*获取当前用户信息*/
      this.getCurrentUserInfo();
    },
    methods: {
      ...mapMutations(['editCurrentEnv', 'editCfgMaps', 'editCurrentStructs','editCurrentUser']),
      initCfgMaps(){
        let me = this;
        fetch.queryAllStructs().then(function (res) {
          if (res.success) {
            me.editCfgMaps(res.data);
          }
        })
      },
      changeStruct(){
        let me = this;
        fetch.queryConfigView({nodePath: me.currentNode.nodePath}).then(function (res) {
            if(res.success){
              me.editCurrentStructs(res.data);
            }else{
              me.editCurrentStructs({});
              if(res.errorCode == 'VIEW_QUERY_NOT_USER'){
                me.$message({
                  showClose: true,
                  message: res.errorMessage,
                  type: 'error'
                })
              }
            }
        })
      },
      getCurrentUserInfo(){
        let me = this;
        fetch.getUserInfo().then(function (res) {
          if (res.success) {
            me.editCurrentUser(res.data);
          }
        })
      },
      initEnv(){
          let location = window.document.location;
          console.log(location);
          if(location.hostname == 'uacc.daily.jv.fliggy.com'){
            this.editCurrentEnv(
              this.env.daily
            );
          }else if(location.hostname == 'uacc.pre.jv.fliggy.com'){
            this.editCurrentEnv(
              this.env.prepub
            )
          }else if(location.hostname == 'uacc.jv.fliggy.com'){
            this.editCurrentEnv(
              this.env.product
            );
          }
      }
    }
  }
</script>
<style>
  .contents {
    position: relative;
    overflow: hidden;
    margin-right: 30px;
    margin-left: 30px;
  }
</style>
